<extend name="Include:Layout"/>
<block name="title">文章</block>
<block name="style">
<link rel="stylesheet" href="/Public/Assets/player/plyr.css">
<style>

</style>
</block>

<block name="main">
	<div class="weui_tab">
		<div class="weui_navbar">
			<div class="toolbar">
		        <div class="toolbar-inner">
		            <a href="javascript:history.go(-1);" class="picker-button close-popup">关闭</a>
		            <h1 class="title" id="banji_title">音乐课</h1>
		        </div>
		    </div>
		</div>
		<div class="weui_tab_bd container" id="container" style="padding-top:44px;">
		    <article class="weui_article" id="detail">
		        
		    </article>
		    <div style="padding:15px;text-align:center;">
		    	<!-- 两个状态都在了 -->
		    	<a href="javascript:;" data-target="#pingjia" class="weui_btn weui_btn_primary open-popup">点评课程</a>
				<p style="font-size:16px;color:#999;">您已评论该课程。</p>
			</div>
		</div>
	</div>
<div id="pingjia" class="weui-popup-container">
  	<div class="weui-popup-overlay"></div>
  	<div class="weui-popup-modal">
  		<div class="toolbar">
	        <div class="toolbar-inner">
	            <a href="javascript:;" class="picker-button close-popup">关闭</a>
	            <h1 class="title" id="banji_title">评价课程</h1>
	        </div>
	    </div>
  		<form style="margin-top:60px;">
  			<div class="weui_cells_title">XX校区，音乐课评价</div>
  			<div class="weui_cells weui_cells_radio">
		        <label class="weui_cell weui_check_label" for="x11">
		            <div class="weui_cell_bd weui_cell_primary">
		                <p>好评</p>
		            </div>
		            <div class="weui_cell_ft">
		                <input type="radio" class="weui_check" name="radio1" value="好评" id="x11" checked="checked">
		                <span class="weui_icon_checked"></span>
		            </div>
		        </label>
		        <label class="weui_cell weui_check_label" for="x12">
		            <div class="weui_cell_bd weui_cell_primary">
		                <p>中评</p>
		            </div>
		            <div class="weui_cell_ft">
		                <input type="radio" name="radio1" class="weui_check" value="中评" id="x12">
		                <span class="weui_icon_checked"></span>
		            </div>
		        </label>
		        <label class="weui_cell weui_check_label" for="x13">
		            <div class="weui_cell_bd weui_cell_primary">
		                <p>差评</p>
		            </div>
		            <div class="weui_cell_ft">
		                <input type="radio" name="radio1" class="weui_check" value="差评" id="x13">
		                <span class="weui_icon_checked"></span>
		            </div>
		        </label>
		    </div>
		    
	        <div class="weui_cells weui_cells_form">
		        <div class="weui_cell">
		            <div class="weui_cell_bd weui_cell_primary">
		                <textarea class="weui_textarea" placeholder="请输入评论" rows="3"></textarea>
		                <div class="weui_textarea_counter"><span>0</span>/200</div>
		            </div>
		        </div>
		    </div>
		    
		    <div style="padding:15px;margin-top:30px;"><a href="javascript:;" id="pinglun_btn" class="weui_btn weui_btn_primary">提交评论</a></div>
  		</form>
  	</div>
</div>
<script type="text/html" id="article_detail">
<h1>{{title}}</h1>
<section>
	<section>
		<video poster="{{vediourl}}?vframe/jpg/offset/5" controls crossorigin>
            <source src="{{vediourl}}" type="video/mp4">
        </video>
	</section>
	<section>
		<!-- 这边的字段你调整一下 -->
		{{summary}}
	</section>
</section>
</script>
</block>

<block name="script">
	<js href="/Public/Assets/player/plyr.js" />
<script>
$(function () {
	$.showLoading("正在加载...");
	$.get('/web/index/get_vedio_detail_test',function(ret){
		if(ret.status){
			var data = ret.data;
			var html = template('article_detail',data);
			$('#detail').html(html);
			$.hideLoading();
		}
	});
	
	$('#pinglun_btn').click(function(){
		console.log($('input[name="radio1"]:checked').val());
	})
});
</script>
</block>